<!DOCTYPE html>
<html lang='en'>

<head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <meta http-equiv='X-UA-Compatible' content='ie=edge'>
    <title>欢太商城</title>
    <link rel="shortcut icon" href="../images/oppo.ico">
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/ht.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2825001_8wdx6usmzxm.css">
    <script src="../lib/js/jquery.js"></script>
    <link rel="stylesheet" href="../lib/css/swiper-bundle.min.css">
    <script src="../lib/js/swiper-bundle.min.js"></script>
    <script src="../lib/js/ajax.js"></script>
    <script src="../lib/js/cookie.js"></script>
    <script src="../lib/layer/layer.js"></script>
    <script src="../js/checkLogin.js"></script>
</head>

<body>
    <div id="header">
        <div class="container">
            <ul>
                <li><a href="">欢太品牌</a></li>
                <li><a href="">欢太云服务</a></li>
                <li><a href="">软件商店</a></li>
                <li><a href="">健康</a></li>
            </ul>
            <ol class="login">
                <li><a href="">欢太商城APP</a></li>
                <li><a href="./login.html"><i class="iconfont icon-yonghu"></i><span>登录</span>
                    </a></li>
                <li><a href="./register.html">注册</a></li>
                <li><a href="../html/cart.html" class="num"><i class="iconfont icon-gouwuchekong "></i><span>购物车</span><span>(0)</span></a></li>
            </ol>
        </div>
    </div>
    <div id="nav">
        <div class="con">
            <h1><img src="../images/logo_03.jpg" alt=""></h1>
            <div class="nav_box">
                <a href="../html/list.html">OPPO专区 </a>
                <a href="">OnePlus专区</a>
                <a href="">realme专区</a>
                <a href="">智能硬件</a>
                <a href="">潮流好物</a>
                <a href="">服务</a>
            </div>
            <input type="text" placeholder="OPPO K9 PRO">
        </div>
    </div>
    <div id="banner">
        <div class="banner">
            <div class="phone_list">
                <div class="menu">
                    <!-- <li>热门推荐</li>
                <li>OPPO</li>
                <li>OnePlus</li>
                <li>realme</li>
                <li>耳机影音</li>
                <li>原装配件</li>
                <li>智能穿戴</li>
                <li>智能电视</li>
                <li>日用百货</li>
                <li>数码周边</li>
                <li>家用电器</li>
                <li>个护健康</li>
                <li>家纺餐厨</li>
                <li>母婴亲子</li> -->
                </div>
                <div class="menu_list">
                    <div class="goodsBox">
                        <!-- <h3>热门推荐</h3>
                        <div>
                            <li>
                                <img src="../images/10_09.jpg" alt="">
                                <span>oppo k9</span>
                            </li>
                        </div> -->
                    </div>
                </div>
            </div>
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <a style="background-image:url(../images/onePuls.jpg) ;"></a>
                    </div>
                    <div class="swiper-slide">
                        <a style="background-image:url(../images/b9.jpg) ;"></a>
                    </div>
                    <div class="swiper-slide">
                        <a style="background-image:url(../images/neo2.jpg) ;"></a>
                    </div>
                    <div class="swiper-slide">
                        <a style="background-image:url(../images/ccf.jpg) ;"></a>
                    </div>
                </div>
                <!-- Add Pagination -->
                <div class="swiper-pagination"></div>
                <!-- Add Arrows -->
                <div class="swiper-button-next" style="right:20%"></div>
                <div class="swiper-button-prev" style="left:30%"></div>
            </div>
        </div>
    </div>
    <div class="cent">
        <div class="con">
            <div class="head">
                <img src="../images/www.heytap_03.jpg" alt="">
                <aside>
                    <a href=""><span>领卷中心</span></a>
                    <a href=""><span>以旧换新</span></a>
                    <a href=""><span>价保政策</span></a>
                    <a href=""><span>企业购</span></a>
                </aside>
                <div>
                    <i class="iconfont icon-yonghu"></i>
                    <ul>
                        <li class="login2">
                            <a href="../html/login.html">登录 |</a>
                            <a href="../html/register.html">注册</a>
                        </li>
                        <span>立即注册领取新人福利</span>
                    </ul>
                </div>
            </div>
            <div class="foot">
                <!-- <img src="../images/www.heytap_19.jpg" alt="">
                <img src="../images/www.heytap_21.jpg" alt="">
                <img src="../images/www.heytap_23.jpg" alt="">
                <img src="../images/75.png" alt=""> -->
            </div>
        </div>
    </div>
    <div class="kill">
        <div class="con">
            <header>
                <h2>限时<i>秒杀</i> </h2>
                <a href="">查看更多 ></a>
            </header>
            <section class="miaosha">
                <!-- <div style="background-color: aqua;">
                </div>
                <div>
                    <img src="../images/www.01_03.jpg" alt="">
                    <span>￥2699</span>
                    <s>￥2799</s>
                    <p>抢购中</p>
                </div>
                <div>
                    <img src="../images/www.01_06.jpg" alt="">
                    <span></span>
                    <span>￥2699</span>
                    <s>￥2799</s>
                    <p>抢购中</p>
                </div>
                <div>
                    <img src="../images/www.01_08.jpg" alt="">
                    <span>￥2699</span>
                    <s>￥2799</s>
                    <p>抢购中</p>
                </div>
                <div>
                    <img src="../images/www.01_08.jpg" alt="">
                    <span>￥2699</span>
                    <s>￥2799</s>
                    <p>已抢完</p>
                </div> -->
            </section>
        </div>
    </div>
    <div class="hot">
        <div class="con">
            <header class="clear-fix">
                <h2>热卖专区</h2>
            </header>
            <section>
                <!-- <div>
                    <li><img src="../images/10_03.jpg" alt=""></li>
                    <div class="lable clear-fix">赠耳机</div>
                    <div class="title">Reno 6</div>
                    <div class="detail">12期免息</div>
                    <div class="price">￥2799</div>
                </div>
                <div>
                    <li><img src="../images/10_05.jpg" alt=""></li>
                    <div class="lable clear-fix red">立减300元</div>
                    <div class="title">K9</div>
                    <div class="detail">积分可抵10...</div>
                    <div class="price">￥1699</div>
                </div>
                <div>
                    <li><img src="../images/10_07.jpg" alt=""></li>
                    <div class="lable clear-fix">积分抵5%</div>
                    <div class="title">OnePlu...</div>
                    <div class="detail">至高优惠10...</div>
                    <div class="price">￥3199</div>
                </div>
                <div>
                    <li><img src="../images/10_09.jpg" alt=""></li>
                    <div class="lable clear-fix">6期免息</div>
                    <div class="title">GT 大师...</div>
                    <div class="detail">骁龙870</div>
                    <div class="price">￥3199</div>
                </div>
                <div>
                    <li><img src="../images/10_15.jpg" alt=""></li>
                    <div class="lable clear-fix">赠无线充电</div>
                    <div class="title">Find X3</div>
                    <div class="detail">积分可抵20...</div>
                    <div class="price">￥3999</div>
                </div>
                <div>
                    <li><img src="../images/10_17.jpg" alt=""></li>
                    <div class="lable clear-fix">6期免息</div>
                    <div class="title">GT Neo...</div>
                    <div class="detail">至高直降20...</div>
                    <div class="price">￥2399</div>
                </div>
                <div>
                    <li><img src="../images/10_18.jpg" alt=""></li>
                    <div class="lable clear-fix red">立减200元</div>
                    <div class="title">K7x</div>
                    <div class="detail">积分可抵10...</div>
                    <div class="price">￥1199</div>
                </div>
                <div>
                    <li><img src="../images/10_19.jpg" alt=""></li>
                    <div class="lable clear-fix red">立减200元</div>
                    <div class="title">A93</div>
                    <div class="detail">赠oppo原...</div>
                    <div class="price">￥1599</div>
                </div> -->
                <!-- <div class="bottom">
                    <img src="../images/10_w25.jpg" alt="" class="left">
                <img src="../images/10_27.jpg" alt="" class="right"> -->

            </section>
        </div>
    </div>
    <div class="oppo">
        <div class="con">
            <header class="clear-fix">
                <h2>oppo专区</h2>
            </header>
            <ul>
                <li>Reno系列</li>
                <li>Find 系列</li>
                <li>K系列</li>
                <li>A系列</li>
                <li>智能耳机</li>
                <li>运动穿戴</li>
                <li>智能电视</li>
                <li>手机配件</li>
            </ul>
            <aside>
                <!-- <img src="../images/20_03.jpg" alt="">
                <div class="title">
                    <img src="../images/20_06.jpg" alt="">
                    <p>Reno6夏日晴海</p>
                    <li><i>赠</i><b>积分抵200</b></li>
                    <span>2799</span>
                </div>
                <div class="title">
                    <img src="../images/20_06.jpg" alt="">
                    <p>Reno6 Pro 星河入梦</p>
                    <li><i>赠</i><b>积分抵200</b></li>
                    <span>￥3199<s>3499</s></span>
                </div>
                <div class="title">
                    <img src="../images/20_06.jpg" alt="">
                    <p>Reno6 Pro+ 月海</p>
                    <li><i>赠</i><b>积分抵200</b></li>
                    <span>￥3699<s>3999</s></span>
                </div> -->
            </aside>
        </div>

    </div>
    <div class="onePlus">
        <div class="con">
            <header class="clear-fix">
                <h2>OnePlus专区</h2>
            </header>
            <ul>
                <li>OnePlus手机</li>
                <li>OnePlus 耳机</li>
                <li>OnePlus手表</li>
                <li>OnePlus 配件</li>
            </ul>
            <aside>
                <!-- <img src="../images/20_10.jpg" alt="">
                <div class="title">
                    <img src="../images/20_12.jpg" alt="">
                    <p>OnePlus 9 Pro</p>
                    <li><b>积分抵5%</b></li>
                    <span>￥4699</span>
                </div>
                <div class="title">
                    <img src="../images/71.png" alt="">
                    <p>OnePlus 9</p>
                    <li><b>积分抵5%</b></li>
                    <span>￥3299<s>￥4999</s></span>
                </div>
                <div class="title">
                    <img src="../images/72.png" alt="">
                    <p>OnePlus 8T</p>
                    <li><b>赠</b></li>
                    <span>￥3899<s>￥4999</s></span>
                </div> -->
            </aside>
        </div>
    </div>
    <div class="realme">
        <div class="con">
            <header class="clear-fix">
                <h2>realme专区</h2>
            </header>
            <ul>
                <li>GT系列</li>
                <li>Q系列</li>
                <li>V系列</li>
                <li>X系列</li>
                <li>Book系列</li>
                <li>畅玩无限</li>
                <li>智能家居</li>
                <li>潮玩周边</li>
                <li>静享声域</li>
            </ul>
            <aside>
                <!-- <img src="../images/20_15.jpg" alt="">
                <div class="title">
                    <img src="../images/40.png" alt="">
                    <p>真我GT Neo2</p>
                    <li><b>预约新品抽积分</b></li>
                    <span>￥99999</span>
                </div>
                <div class="title">
                    <img src="../images/41.png" alt="">
                    <p>真我GT 大师探索版</p>
                    <span>￥2899</span>
                </div>
                <div class="title">
                    <img src="../images/42.png" alt="">
                    <p>真我GT 大师版</p>
                    <span>￥2399</span>
                </div>
                <div class="title top">
                    <img src="../images/43.png" alt="">
                    <p>真我GT Neo 闪速版</p>
                    <li><b>天机1200</b></li>
                    <span>￥1899<s>2099</s></span>
                </div>
                <div class="title">
                    <img src="../images/44.png" alt="">
                    <p>真我GT 银河战舰</p>
                    <li><b>骁龙888</b></li>
                    <span>￥2899<s>3999</s></span>
                </div>
                <div class="title nul">
                </div>
                <div class="title nul">
                </div>
                <div class="title nul">
                </div> -->
            </aside>
        </div>
    </div>
    <div class="goods">
        <div class="con">
            <header class="clear-fix">
                <h2>智能好物</h2>
            </header>
            <ul>
                <li>智能声学</li>
                <li>智能穿戴</li>
                <li>智能电视</li>
                <li>配件周边</li>
            </ul>
            <aside>
                <!-- <img src="../images/30_03.jpg" alt="">
                <div class="title">
                    <img src="../images/31.png" alt="">
                    <p>OPPO Enco Air 新品耳机</p>
                    <span>￥99</span>
                </div>
                <div class="title">
                    <img src="../images/50.png" alt="">
                    <p>OPPO Enco Air灵动版</p>
                    <span>￥2899</span>
                </div>
                <div class="title">
                    <img src="../images/51.png" alt="">
                    <p>OPPO Enco ×降噪耳机</p>
                    <li><b>积分抵10%</b></li>
                    <span>￥799</span>
                </div>
                <div class="title">
                    <img src="../images/52.png" alt="">
                    <p>OPPO Enco W51降噪耳机</p>
                    <li><b>积分抵50%</b></li>
                    <span>￥349</span>
                </div>
                <div class="title">
                    <img src="../images/53.png" alt="">
                    <p>OPPO Enco Free2蓝牙耳机</p>
                    <li><b>积分抵5%</b></li>
                    <span>￥599</span>
                </div>
                <div class="title">
                    <img src="../images/54.png" alt="">
                    <p>OPPO Enco Free2蓝牙耳机</p>
                    <li><b>积分抵100%</b></li>
                    <span>￥299</span>
                </div>
                <div class="title">
                    <img src="../images/55.png" alt="">
                    <p>OPPO Enco Play</p>
                    <li><b>积分抵10%</b></li>
                    <span>￥399</span>
                </div>
                <div class="title">
                    <img src="../images/57.png" alt="">
                    <p>半入耳式耳机3.5mm接</p>
                    <li><b>积分抵100%</b></li>
                    <span><i>补贴价</i>￥2899</span>
                </div> -->
            </aside>
        </div>
    </div>
    <div class="tide">
        <div class="con">
            <header class="clear-fix">
                <h2>潮流好物</h2>
            </header>
            <ul>
                <li>超级爆款</li>
                <li>大牌精选</li>
                <li>聚惠特价</li>
                <li>严选好物</li>
            </ul>
            <aside>
                <!-- <div class="live"></div>
                <div class="title">
                    <img src="../images/60.png" alt="">
                    <p>森米数据线</p>
                    <li><b>积分抵100%</b></li>
                    <span>￥99<s>19.9</s>
                    </span>
                </div>
                <div class="title">
                    <img src="../images/61.png" alt="">
                    <p>【新疆棉】大优蜂窝...</p>
                    <li><b>积分抵50%</b></li>
                    <span>￥2899</span>
                </div>
                <div class="title">
                    <img src="../images/62.png" alt="">
                    <p>公牛防过充智能定时...</p>
                    <li><b>积分抵10%</b></li>
                    <span>￥799<s>￥99</s></span>
                </div> -->
            </aside>
        </div>
    </div>
    <div class="news">
        <div class="con">
            <div><i class="iconfont icon-quanguolianbao"></i><span>1年全国联保</span></div>
            <div><i class="iconfont icon-qitianwuliyoutuihuanhuo"></i><span>7天无理由退货</span></div>
            <div><i class="iconfont icon-huanhuo"></i><span>官方换货保障</span></div>
            <div><i class="iconfont icon-baoyou"></i><span>满69元包邮</span></div>
            <div><i class="iconfont icon-wangdianchaxun"></i><span>916家售后网点</span></div>
        </div>
    </div>
    <div class="footer">
        <div class="con">
            <div class="left_box">
                <ul>
                    <li><a href="">关于欢太</a></li>
                    <li><a href="">了解欢太</a></li>
                    <li><a href="">欢太产品与服务</a></li>
                    <li><a href="">联系我们</a></li>
                </ul>
                <ul>
                    <li><a href="">OPPO产品</a></li>
                    <li><a href="">OPPO Reno6</a></li>
                    <li><a href="">OPPO Reno6 Pro</a></li>
                    <li><a href="">OPPO Reno6 Pro+</a></li>
                    <li><a href="">OPPO Find ×3 Pro</a></li>
                    <li><a href="">OPPO Find ×3</a></li>
                    <li><a href="">OPPO Reno5</a></li>
                    <li><a href="">OPPO K9</a></li>
                    <li><a href="">OPPOK7x</a></li>
                    <li><a href="">OPPO A93s</a></li>
                    <li><a href="">OPPO A93</a></li>
                </ul>
                <ul>
                    <li><a href="">一加产品</a></li>
                    <li><a href="">OnePlus 9 Pro</a></li>
                    <li><a href="">OnePlus 9</a></li>
                    <li><a href="">OnePlus 9R</a></li>
                    <li><a href="">OnePlus 8T</a></li>
                    <li><a href="">OnePlus Watch</a></li>
                    <li><a href="">OnePlus Buds Pro</a></li>
                </ul>
                <ul>
                    <li><a href="">realme产品</a></li>
                    <li><a href="">真我GT大师探索版</a></li>
                    <li><a href="">真我X7 Pro至尊版</a></li>
                    <li><a href="">真我Q3Pro</a></li>
                    <li><a href="">真我V15</a></li>
                    <li><a href="">realme Book</a></li>
                    <li><a href="">真我Buds Wireless 2 Neo</a></li>
                </ul>
                <ul>
                    <li><a href="">服务政策</a></li>
                    <li><a href="">OPPO售后政策</a></li>
                    <li><a href="">一加售后政策</a></li>
                    <li><a href="">realme售后政策</a></li>
                    <li><a href="">配送发货说明</a></li>
                    <li><a href="">花呗分期说明</a></li>
                    <li><a href="">电子发票说明</a></li>
                </ul>
            </div>
            <div class="right_box">
                <div>
                    <i class="iconfont icon-zaixiankefu"></i>
                    <span>在线客服</span>
                </div>
                <h6>400-1999-666</h6>
                <p>全国24小时热线</p>
            </div>
        </div>
    </div>
    <div class="copy">
        <div class="con">
            <aside>
                <span>2021欢太版权所有</span>
                <a href="">粤ICP备14012291号 |</a>
                <a href="">隐私政策 |</a>
                <a href="">用户使用协议 |</a>
                <a href="">资质证照 |</a>
                <a href="">知识产权</a>
            </aside>
            <p>粤公网安备44190002004935号</p>
        </div>
    </div>
    <div id="fixed">
        <li><i class="iconfont icon-zaixiankefu"></i><span>在线客服</span></li>
        <li><i class="iconfont icon-liuliankefurexian"></i><span>客服热线</span></li>
        <li><i class="iconfont icon-saoma"></i><span>下载app</span></li>
        <li><i class="iconfont icon-xiaolianhaoping"></i><span>浏览评价</span></li>
        <li class="backTop"><i class="iconfont icon-huidaodingbu"></i><span>回到顶部</span></li>
    </div>
</body>
<script src="../js/index.js"></script>
<script src="../js/hot.js"></script>
<script src="../js/oppo.js"></script>
<script src="../js/data.js"></script>
<script src="../js/data_list.js"></script>
<script src="../js/realme.js"></script>

</html>
<script>
    var swiper = new Swiper('.swiper-container', {
        loop: true,
        autoplay: true,
        pagination: {
            el: '.swiper-pagination',
            clickable: true,

        },
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });
    // 
    $('.banner').hover(function() {
            $('.swiper-button-next,.swiper-button-prev').css('display', 'block')
        }, function() {
            $('.swiper-button-next,.swiper-button-prev').css('display', 'none')

        })
        // 
    $(window).scroll(function() {
        let timer;
        // 判断卷曲的高度是否大于1000
        if ($(window).scrollTop() >= 900) {
            // 显示回到顶部按钮,并绑定点击事件，实现点击回到顶部
            $('#fixed').css('display', 'block').find('.backTop').click(function() {
                let n = $(window).scrollTop();
                // 使用定时器实现缓慢回到顶部
                timer = setInterval(function() {
                    n = 0;
                    $(window).scrollTop(n);
                    if ($(window).scrollTop() <= 0) {
                        clearInterval(timer);
                    }
                }, 10);
            }).hover(function() {
                $(this).find('span ,i').css('color', 'red')
            }, function() {
                $(this).find('span ,i').css('color', '#9e9e9e')
            })
        } else {
            $('#fixed').css('display', 'none')
        }
    })
</script>